<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Work Requirement 4 - JavaScript Form Validation</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />
  <script type="text/javascript" src="js/contact-me.js"></script>
</head>

<body>

<div id="header">
  <h1><a href="index.html">Work Requriement 4</a></h1>
  <p>JavaScript Form Validation</p>
</div>

<div id="content">


<div id="main">
  <h2>Contact Me</h2>


  <form id="contact" action="" onsubmit="checkContactForm(); return false;">
    <p>Fill in the form below to send me a message!</p>    
    <p>
      <label for="firstname">First name:</label>
      <input name="firstname" id="firstname" onfocus="resetField(this);" />
    </p>
    <p>
      <label for="lastname">Last name:</label>
      <input name="lastname" id="lastname" onfocus="resetField(this);" />
    </p>
    <p>
      <label for="email">E-mail address:</label>
      <input name="email" id="email" onfocus="resetField(this);" />
    </p>
    <p>
      <label for="message">Your Message:</label>
      <textarea name="message" id="message" onfocus="resetField(this);"></textarea>
    </p>
    <p>
      <button type="submit">Send Message</button>
      <button type="reset">Reset Form</button>
    </p>
  </form>
  
    
</div>


<div id="navigation">
  <h2>Navigation</h2>
  <ul>
    <li><a href="contact-me.html">Contact Me</a></li>
    <li><a href="html5-inputs.html">HTML5 Form Inputs</a></li>
  </ul>
</div>


</div>

<div id="footer">
  <p>All content, unless othewise stated, are &copy; 2014 <strong>Your Name Here</strong>.</p>
</div>
  
</body>

</html>